<template>
	<view ></view>
	<!-- <view class="tabbar_bottom flex" :style="{background: background}">
		<view class="tabbar_item flex_column" v-for="(item, index) in list" :key="index" @tap="switchNav(index, item)">
			<image class="tabbar_img" :src="currentTab == index ? item.selectedIconPath : item.iconPath" mode="">
			</image>
			<view :class="currentTab == index ? 'tabbar_label act' : 'tabbar_label'">{{item.text}}</view>
		</view>
	</view> -->
	
	<!-- <view class="footer bg27 d-flex">
		<block v-for="(item,index) in tabBar" :key="index">
			<view class="flex-1 d-flex f-column a-center j-centert" @click="switchNav(index,item)">
				<view class="iconfont size40 icon-shouye" 
					:class="[currentTab == index?'white':'color_7e',item.iconPath]"></view>
				<text class="size-28" :class="currentTab == index?'white':'color_7e'">{{item.text}}</text>
			</view>
		</block>
	</view> -->
</template>

<script>
	export default {
		props: {
			background: {
				type: String,
				default: ''
			},
			currentTab: {
				type: String,
				default: ''
			}
		},
		data() {
			return {
				tabBar:[{
					pagePath: "../index/index",
					iconPath:'icon-shouye',
					text: "首页"
				},{
					pagePath: "../forum/forum",
					iconPath:'icon-faxian',
					text: "发现"
				},{
					pagePath: "../Collection/Collection",
					iconPath:'icon-shoucang-',
					text: "藏品"
				},{
					pagePath: "../my/my",
					iconPath:'icon-wode',
					text: "我的"
				}],
				
				
				// tabBar:[{
				// 	pagePath: "../index/index",
				// 	iconPath:'icon-shouye',
				// 	text: "首页"
				// },{
				// 	pagePath: "../index/secondHand",
				// 	iconPath:'icon-faxian',
				// 	text: "发现"
				// },{
				// 	pagePath: "../manghe/index",
				// 	iconPath:'icon-shoucang-',
				// 	text: "藏品"
				// },{
				// 	pagePath: "../my/my",
				// 	iconPath:'icon-wode',
				// 	text: "我的"
				// }],
			}
		},
		methods: {
			switchNav(index, item) {
				if(index == this.currentTa) return;
				this.toUrl(item.pagePath)
			}
		},
		
		watch:{
			currentTab:{
				deep:true,
				immediate:true,
				handler(newVal){
					console.log(newVal);
				}
			}
		}
	}
</script>

<style lang="scss" scoped>
	
	.footer{
		width: 100%;
		height: 120rpx;
		position: fixed;
		left: 0;
		bottom: 0;
		z-index: 998;
		
	}
	
	.tabbar_bottom {
		width: 100%;
		height: 120rpx;
		position: fixed;
		left: 0;
		bottom: 0;
		// border-top: 2rpx solid #a4a4a4;
		z-index: 998;
		background: #010101;
		backdrop-filter: blur(13px);
		-webkit-backdrop-filter:blur(13px);
		.tabbar_item {
			flex: 1;
		}

		.tabbar_img {
			width: 42rpx;
			height: 42rpx;
			margin-bottom: 8rpx;
		}

		.tabbar_label {
			color: #fff;
			font-size: 20rpx;
			&.act {
				color: #00D18B;
			}
		}
	}
</style>
